<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>数据字典管理</title>
<link rel="stylesheet" type="text/css" href="../res/css/common.css"/>
<link rel="stylesheet" type="text/css" href="../res/easyui1.5.3/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../res/easyui1.5.3/themes/icon.css">
<link rel="stylesheet" href="../res/zTree_v3/css/zTreeStyle/zTreeStyle.css" type="text/css">
<script type="text/javascript" src="../res/easyui1.5.3/jquery.min.js"></script>
<script type="text/javascript" src="../res/easyui1.5.3/jquery.easyui.min.js"></script>
<script src="../res/easyui1.5.3/locale/easyui-lang-zh_CN.js" type="text/javascript" charset="utf-8"></script>
<script src="../res/easyui1.5.3/easyui-utils.js" type="text/javascript" charset="utf-8"></script>
<script src="../res/js/tools.js" type="text/javascript" charset="utf-8"></script>
<script src="../res/zTree_v3/js/jquery.ztree.all.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../res/zTree_v3/js/ztreeUtil.js" type="text/javascript" charset="utf-8"></script>
<script type="application/javascript">
	/**
	 * 页面初始化时执行
	 */
	$(document).ready(function() {
		// 异步初始化ztree树对象
		//asyncInitZTreeObject("resourceTree", "../json/resourceZtree.json", "get", true);
		// 使用本地数据初始化ztree树对象
		//var nodeList = {"name":"所有权限","pid":null,"open":true,"checked":true,"children":[{"id":1,"pid":0,"name":"权限管理","action":"#","icon":"icon-man","open":true,"type":0,"description":"action:{type=0时为#，type=1时为url，type=2时页面按钮权限标识} type:0、导航条，1、导航菜单，2、页面按钮 ","createTime":"2017-02-09 12:00:00","updateTime":"2017-02-09 12:00:00","children":[{"id":2,"pid":1,"name":"资源管理","action":"/rescource.html","icon":"icon-man","open":true,"checked":true,"type":1,"description":"action:{type=0时为#，type=1时为url，type=2时页面按钮权限标识} type:0、导航条，1、导航菜单，2、页面按钮 ","createTime":"2017-02-09 12:00:00","updateTime":"2017-02-09 12:00:00","children":[{"id":7,"pid":2,"name":"查看","action":"look","icon":"icon-man","open":true,"checked":true,"type":2,"description":"action:{type=0时为#，type=1时为url，type=2时页面按钮权限标识} type:0、导航条，1、导航菜单，2、页面按钮 ","createTime":"2017-02-09 12:00:00","updateTime":"2017-02-09 12:00:00"},{"id":8,"pid":2,"name":"添加","action":"add","icon":"icon-man","open":true,"type":2,"description":"action:{type=0时为#，type=1时为url，type=2时页面按钮权限标识} type:0、导航条，1、导航菜单，2、页面按钮 ","createTime":"2017-02-09 12:00:00","updateTime":"2017-02-09 12:00:00"},{"id":9,"pid":2,"name":"修改","action":"update","icon":"icon-man","open":true,"type":2,"description":"action:{type=0时为#，type=1时为url，type=2时页面按钮权限标识} type:0、导航条，1、导航菜单，2、页面按钮 ","createTime":"2017-02-09 12:00:00","updateTime":"2017-02-09 12:00:00"}]},{"id":3,"pid":1,"name":"数据字典管理","action":"/role.html","icon":"icon-man","open":true,"type":1,"description":"action:{type=0时为#，type=1时为url，type=2时页面按钮权限标识} type:0、导航条，1、导航菜单，2、页面按钮 ","createTime":"2017-02-09 12:00:00","updateTime":"2017-02-09 12:00:00"},{"id":4,"pid":1,"name":"用户管理","action":"/user.html","icon":"icon-man","open":true,"type":1,"description":"action:{type=0时为#，type=1时为url，type=2时页面按钮权限标识} type:0、导航条，1、导航菜单，2、页面按钮 ","createTime":"2017-02-09 12:00:00","updateTime":"2017-02-09 12:00:00"}]},{"id":5,"pid":0,"name":"部门管理","action":"#","icon":"icon-man","open":true,"type":0,"description":"action:{type=0时为#，type=1时为url，type=2时页面按钮权限标识} type:0、导航条，1、导航菜单，2、页面按钮 ","createTime":"2017-02-09 12:00:00","updateTime":"2017-02-09 12:00:00","children":[{"id":6,"pid":5,"name":"运营中心","action":"/rescource.html","icon":"icon-man","open":true,"type":1,"description":"action:{type=0时为#，type=1时为url，type=2时页面按钮权限标识} type:0、导航条，1、导航菜单，2、页面按钮 ","createTime":"2017-02-09 12:00:00","updateTime":"2017-02-09 12:00:00"}]}]};
		//initZTreeObjectByData("resourceTree", nodeList, true);
   	});
		
	/**
	 * 打开添加对话框
	 */
	function openAddDialog(){
		$("#updateDialogForm").form("clear");
		openDialog('updateDialog', '添加数据字典数据');
	}
	
	/**
	 * 打开修改对话框 
	 */
	function openUpdateDialog(){
		var row = getDatagridSelectedRow("datagridTable");
		$("#updateDialogForm").form("load", row);
		openDialog('updateDialog', '修改数据字典数据');
	}


	
	/**
	 * 格式化显示状态
	 * @param {Object} value
	 * @param {Object} row
	 * @param {Object} index
	 */
	function formatterStatus(value,row,index){
		var typeStr = "<span style='color:#FECD51;'>未知状态</span>";
		switch(value){
			case 0:
			typeStr = "<span style='color:green;'>正常</span>";
			break;
			case 1:
			typeStr = "<span style='color:red;'>禁用</span>";
			break;
		}
		return typeStr;
	}
	
	/**
	 * 提交修改的数据
	 */
	function submitUpdateForm(){
		var obj = $('#updateDialogForm').form("getData", true);
		if($('#updateDialogForm').form("validate")){
			doAjax("../json/success.json", "GET", obj, true, function(result){
				showMsg(result.msg);
				if(result.code == AJAX_HANDLE_SUCCESS){
					closeDialog("updateDialog");
					// 表格数据重新加载
					$("#datagridTable").treegrid("reload");
				}
			});
		}
	}
	
	/**
	 * 提交查询form 
	 */
	function submitQueryForm(){
		var obj = $('#queryForm').form("getData", true);
		doAjax("../json/success2.json", "GET", obj, true, function(result){
			if(result.msg != ""){
				showMsg(result.msg);
			}
			if(result.code == AJAX_HANDLE_SUCCESS){
				// 填充加载到的数据
				$("#datagridTable").treegrid("loadData", result.data);
			}
		});
	}
</script>
</head>
<body>
<table id="datagridTable" class="easyui-datagrid" fit="true"
        data-options="method:'get', 
        url:'../json/dataDictionaryList.json',
        fitColumns:true,
        singleSelect:true,
        pagination:true,
        rownumbers:true,
        toolbar:'#datagridTableToolBtns'
      	">  
    <thead>  
        <tr>  
        	<th data-options="field:'id', checkbox:true, align:'center'">key</th>
            <th data-options="field:'key', width:80">关键字</th>  
            <th data-options="field:'value', width:80">值</th>  
            <th data-options="field:'status',width:20, formatter:formatterStatus">状态</th>
            <th data-options="field:'description', width:80">描述</th>  
            <th data-options="field:'createTime',width:40">创建时间</th>
            <th data-options="field:'updateTime',width:40">修改时间</th>
        </tr>  
    </thead>  
</table>

<!--表格工具区域-->
<div id="datagridTableToolBtns">
	<a href="javascript:openAddDialog();" class="easyui-linkbutton" data-options="iconCls:'icon-add'">添加</a>
	<a href="javascript:openUpdateDialog();" class="easyui-linkbutton" data-options="iconCls:'icon-edit'">修改</a>
	<span>|</span>
	<form id="queryForm" class="i-b">
		关键字：<input name="key" class="easyui-textbox" />
		创建日期：<input name="startTime" class="easyui-datetimebox" editable="false"/>到<input name="endTime" class="easyui-datetimebox" editable="false"/>
		<a href="javascript:submitQueryForm();" class="easyui-linkbutton" data-options="iconCls:'icon-search',plain:true">查询</a>
	</form>
</div>
<!-- 工具区域结束 -->

<!-- 添加数据字典 -->
<div id="updateDialog" class="easyui-dialog" style="width:400px;height:300px; padding:10px;"  
        data-options="iconCls:'icon-save',resizable:true,modal:true, close:true,closed:true, buttons:'#dialogBtns'">  
    <form id="updateDialogForm" class="dialogForm">
    		<input type="hidden" name="id" id="id" value="-1" />
	    <div class="row"> 
	        <label for="name">关键字:</label>  
	        <input class="easyui-validatebox" type="text" name="key" data-options="required:true" />  
	    </div>
	    <div class="row"> 
	        <label for="type">对应值:</label>  
	        <input class="easyui-validatebox" type="text" name="value" data-options="required:true" />  
	    </div>
	    <div class="row"> 
	        <label for="type">状态:</label>  
	        <select id="typeSelectBox" class="easyui-combobox" name="status"  data-options="panelHeight:'auto'" style="width:200px;">  
			    <option value="0">正常</option>
			    <option value="1">禁用</option>
			</select>
	    </div>  
	    <div class="row">
	        <label for="description" style="vertical-align: top;">数据字典描述:</label>  
	        <textarea name="description" style="width: 200px; height: 100px;"></textarea>
	    </div>
    </form> 
</div> 
<div id="dialogBtns" style="text-align: center;">
	<a href="javascript:submitUpdateForm();" class="easyui-linkbutton" style="width: 40px;">提交</a>
</div>
<!-- 添加数据字典 结束-->
</body>
</html>
